.person-selector{
  .selector-item{
    display: block;
    padding: 5px 0px 5px 5px;
    cursor: pointer;
    border-radius: 4px;
    &.selected{
      background: #F2F6FF;
      .selector-item-content{
        .user-info-wrapper{
          .user-info-name{
            color: #1F70FC;
          }
        }
      }
    }
    &.disabled{
      background: #f7f8fa;
      cursor: not-allowed;
      &:hover{
        background: #f7f8fa;
      }
    }
    &:hover{
      background: #F2F6FF;
    }
    .selector-item-content{
      display: flex;
      align-items: center;
      .user-avatar{
        width: 32px;
        height: 32px;
        text-align: center;
        line-height: 32px;
        background: #eee;
        border-radius: 50%;
        flex: none;
        overflow: hidden;
        .img-responsive{
          max-width: 100%;
          vertical-align: top;
        }
      }
      .user-info-wrapper{
        flex: 1;
        padding-left: 10px;
        max-width: calc(100% - 32px);
        text-align: left;
        .user-info-name{
          font-size: 14px;
          color: #1E2126;
        }
        .user-info-department{
          font-size: 12px;
          color: #848C95;
        }
        .departed-employee{
          display: inline-block;
          background: #FFE9ED;
          border-radius: 2px;
          font-size: 11px;
          color: #FF6680;
          line-height: 16px;
          padding: 0 2px;
          margin-left: -5px;
          transform: scale(0.75);
        }
      }

    }
  }
}
